﻿<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/view/common/taglibs.jsp"%>

<!DOCTYPE html>
<head>
    <meta name="description" content="overview & stats" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <%@ include file="/WEB-INF/view/common/common.jsp"%>
    <link href="${ctx}/resources/css/style.css" rel="stylesheet">
    <script src="${ctx}/resources/plugins/echarts/echarts.js"></script>
    
    <script type="text/javascript">
            $(document).ready(function() {

                $(".t_Record").width($(window).width() - 320);
                //当文档窗口发生改变时 触发  
                $(window).resize(function() {
                    $(".t_Record").width($(window).width() - 320);
                });
            });

            require.config({
                paths : {
                    echarts : '../resources/plugins/echarts'
                }
            });
            require([ 'echarts', 'echarts/theme/macarons',
                    'echarts/chart/line', // 按需加载所需图表，如需动态类型切换功能，别忘了同时加载相应图表
                    'echarts/chart/bar' ], function(ec, theme) {
                var myChart = ec.init(document.getElementById('main'), theme);
                option = {
                    title : {
                        text : '该图表为静态数据，目前只作为展示',
                        subtext : '并未有实际功能统计'
                    },
                    tooltip : {
                        trigger : 'axis'
                    },
                    legend : {
                        data : [ '所有订单', '待付款', '已付款', '代发货' ]
                    },
                    toolbox : {
                        show : true,
                        feature : {
                            mark : {
                                show : true
                            },
                            dataView : {
                                show : true,
                                readOnly : false
                            },
                            magicType : {
                                show : true,
                                type : [ 'line', 'bar' ]
                            },
                            restore : {
                                show : true
                            },
                            saveAsImage : {
                                show : true
                            }
                        }
                    },
                    calculable : true,
                    xAxis : [ {
                        type : 'category',
                        data : [ '1月', '2月', '3月', '4月', '5月', '6月', '7月',
                                '8月', '9月', '10月', '11月', '12月' ]
                    } ],
                    yAxis : [ {
                        type : 'value'
                    } ],
                    series : [
                            {
                                name : '所有订单',
                                type : 'bar',
                                data : [ 120, 49, 70, 232, 256, 767, 1356,
                                        1622, 326, 200, 164, 133 ],
                                markPoint : {
                                    data : [ {
                                        type : 'max',
                                        name : '最大值'
                                    }, {
                                        type : 'min',
                                        name : '最小值'
                                    } ]
                                }
                            },
                            {
                                name : '待付款',
                                type : 'bar',
                                data : [ 26, 59, 30, 84, 27, 77, 176, 1182,
                                        487, 188, 60, 23 ],
                                markPoint : {
                                    data : [ {
                                        name : '年最高',
                                        value : 1182,
                                        xAxis : 7,
                                        yAxis : 1182,
                                        symbolSize : 18
                                    }, {
                                        name : '年最低',
                                        value : 23,
                                        xAxis : 11,
                                        yAxis : 3
                                    } ]
                                },

                            },
                            {
                                name : '已付款',
                                type : 'bar',
                                data : [ 26, 59, 60, 264, 287, 77, 176, 122,
                                        247, 148, 60, 23 ],
                                markPoint : {
                                    data : [ {
                                        name : '年最高',
                                        value : 172,
                                        xAxis : 7,
                                        yAxis : 172,
                                        symbolSize : 18
                                    }, {
                                        name : '年最低',
                                        value : 23,
                                        xAxis : 11,
                                        yAxis : 3
                                    } ]
                                },

                            },
                            {
                                name : '代发货',
                                type : 'bar',
                                data : [ 26, 59, 80, 24, 87, 70, 175, 1072, 48,
                                        18, 69, 63 ],
                                markPoint : {
                                    data : [ {
                                        name : '年最高',
                                        value : 1072,
                                        xAxis : 7,
                                        yAxis : 1072,
                                        symbolSize : 18
                                    }, {
                                        name : '年最低',
                                        value : 22,
                                        xAxis : 11,
                                        yAxis : 3
                                    } ]
                                },

                            } ]
                };

                myChart.setOption(option);
            });
        </script>
        
</head>
<body>
	<div class="page-content clearfix">
		<div class="alert alert-block alert-success" style="margin-left: 10px;">
			<button type="button" class="close" data-dismiss="alert">
				<i class="icon-remove"></i>
			</button>
			<i class="icon-ok green"></i>欢迎访问<strong class="orange">&nbsp;JAVA技术后台管理系统(v3.0)</strong>，你本次登陆时间为<strong class="orange">&nbsp;${curTime}</strong>，登陆IP：<strong class="orange">&nbsp;${clientIp}</strong>.
		</div>
		<div class="state-overview clearfix">
			<div class="col-lg-3 col-sm-6">
				<section class="panel">
					<a target="_blank" href="http://git.oschina.net/zhoubang85/" title="http://git.oschina.net/zhoubang85/">
						<div class="symbol terques">
							<i class="icon-github-sign"></i>
						</div>
						<div class="value">
							<h3 style="margin-left: -30px">我的开源中国</h3>
							<p style="margin-left: -40px;margin-top: 10px;">http://git.oschina.net/zhoubang85/</p>
						</div>
					</a>
				</section>
			</div>
			<div class="col-lg-3 col-sm-6">
                <section class="panel">
                    <a target="_blank" href="http://git.oschina.net/zhoubang85/zb-server/" title="http://git.oschina.net/zhoubang85/zb-server/">
                        <div class="symbol red">
                            <i class=" icon-globe"></i>
                        </div>
                        <div class="value">
                            <h3 style="margin-left: -30px">项目永久域名</h3>
                            <p style="margin-left: -40px;margin-top: 10px;">www.2b2b92b.com</p>
                        </div>
                    </a>
                </section>
            </div>
            <div class="col-lg-3 col-sm-6">
                <section class="panel">
                    <a target="_blank" href="http://git.oschina.net/zhoubang85/zb-server/" title="http://git.oschina.net/zhoubang85/zb-server/">
                        <div class="symbol yellow">
                            <i class="icon-twitter"></i>
                        </div>
                        <div class="value">
                            <h3 style="margin-left: -30px">项目免费开源</h3>
                            <p style="margin-left: -40px;margin-top: 10px;">提倡开源、免费分享</p>
                        </div>
                    </a>
                </section>
            </div>
            <div class="col-lg-3 col-sm-6">
                <section class="panel">
                    <a target="_blank" href="http://git.oschina.net/zhoubang85/zb-server/" title="http://git.oschina.net/zhoubang85/zb-server/">
                        <div class="symbol darkblue">
                            <i class="icon-thumbs-up"></i>
                        </div>
                        <div class="value">
                            <h2 style="margin-left: -30px">${sourceCount}</h2>
                            <p style="margin-left: -40px;margin-top: 10px;">项目源码、技术资源免费分享数量累计</p>
                        </div>
                    </a>
                </section>
            </div>
		</div>
		
		<!--QQ技术群二维码-->
        <div class="clearfix">
            <div class="news_style">
                <div class="title_name" style="font-size: 12px;font-weight: bold;color: #FF6C60">QQ技术群：470414533</div>
                <div>
                    <img alt="扫码加入" width="230px" height="280px" src="${ctx}/resources/images/QQqun-my.jpg">
                </div>
            </div>
            <div class="news_style">
                <div class="title_name" style="font-size: 12px;font-weight: bold;color: #2EC7C9;">QQ技术群：135138817</div>
                <div>
                    <img alt="扫码加入" width="230px" height="280px" src="${ctx}/resources/images/QQqun-java.jpg">
                </div>
            </div>
            <div class="news_style">
                <div class="title_name" style="font-size: 12px;font-weight: bold;color: #438EB9">QQ技术群：211286137</div>
                <div>
                    <img alt="扫码加入" width="230px" height="280px" src="${ctx}/resources/images/QQqun-mybatis.jpg">
                </div>
            </div>
            <!-- 
            <div class="news_style">
                <div class="title_name" style="font-size: 12px;font-weight: bold;color: #F47033">QQ技术群：254479630</div>
                <div>
                    <img alt="扫码加入" width="230px" height="280px" src="${ctx}/resources/images/QQqun-java3.jpg">
                </div>
            </div>
            <div class="news_style">
                <div class="title_name" style="font-size: 12px;font-weight: bold;">QQ技术群：73889729</div>
                <div>
                    <img alt="扫码加入" width="230px" height="280px" src="${ctx}/resources/images/QQqun-java2.jpg">
                </div>
            </div>
             -->
        </div>
        
        
		<!--项目动态、图表-->
		<div class="clearfix" style="margin-top: 10px;">
			<div class="news_style">
				<div class="title_name">项目最新动态</div>
				<ul class="list">
					<li><i class="icon-bell red"></i><a target="_blank" href="http://git.oschina.net/zhoubang85/zb-server">登录页面改版，内部首页改版。</a></li>
					<li><i class="icon-bell red"></i><a target="_blank" href="http://git.oschina.net/zhoubang85/zb-server">加入socket服务器推送功能(暂未部署到菜单)。</a></li>
					<li><i class="icon-bell red"></i><a target="_blank" href="http://git.oschina.net/zhoubang85/zb-server">新增微信模板消息通知功能，结合MQ消息异步通知发送模板消息。</a></li>
					<li><i class="icon-bell red"></i><a target="_blank" href="http://git.oschina.net/zhoubang85/zb-server">加入activemq消息技术，通过模拟实现订单同步，结合MQ消息发送微信模板消息，通知用户同步成功。</a></li>
					<li><i class="icon-bell red"></i><a target="_blank" href="http://git.oschina.net/zhoubang85/zb-server">项目结构重新整合，采用maven模块化管理与开发，方便学习、管理。</a></li>
				</ul>
			</div>
			<div class="t_Record">
                <div id="main" style="height: 300px; overflow: hidden; width: 100%; overflow: auto;"></div>
            </div>
		</div>
	</div>
</body>
</html>
